{extend name="user-layout" /}
{block name="content"}
<div class="content-wrapper">
    <div class="row">
        {include file="balance/info"}
        <div class="col-md-8 grid-margin stretch-card">
            <div class="card">
                <div class="card-body">
                    <h4 class="card-title">充值</h4>
                    <!--<p class="card-description text-danger">注： ！</p>-->
                    <!--<ul class="nav nav-tabs tab-basic" role="tablist">-->
                        <!--<li class="nav-item">-->
                            <!--<a class="nav-link active" id="apply-tab" data-toggle="tab" href="#apply" role="tab" aria-controls="apply" aria-selected="true"><i class="icon-wallet"></i>申请提现</a>-->
                        <!--</li>-->
                        <!--<li class="nav-item">-->
                            <!--<a class="nav-link" id="set-tab" data-toggle="tab" href="#set" role="tab" aria-controls="set" aria-selected="false"><i class="icon-settings"></i>提现设置</a>-->
                        <!--</li>-->
                    <!--</ul>-->
                    <div class="tab-content tab-content-basic">
                        <div class="tab-pane fade show active" id="apply" role="tabpanel" aria-labelledby="apply-tab">
                            <form class="layui-form forms-sample" action="{:url(\'index/Balance/charge\')}" method="post" id="app-balance-charge-form" target="_blank">
                                <input name="b[uid]" value="{$info.uid}" hidden disabled readonly>
                                <div class="form-group row">
                                    <label for="amount" class="col-sm-2 col-form-label">充值金额</label>
                                    <div class="col-sm-9">
                                        <input type="text" name="b[amount]" value="" required lay-verify="required|vernum" class="form-control" minlength="2" maxlength="6" id="amount" placeholder="充值金额">
                                    </div>
                                </div>

                                <div class="form-group row">
                                    <label class="col-sm-2 col-form-label"></label>
                                    <div class="col-sm-9">
                                        <button type="button" class="btn btn-primary btn-submit-balance-apply btn-fw" lay-submit lay-filter="app-balance-apply-submit">充值</button>
                                    </div>
                                </div>
                            </form>
                        </div>

                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="col-md-12">
            <div class="card">
                <h4 class="card-header">充值记录</h4>
                <div class="card-body">
                    <div class="table-responsive">
                        <table class="table table-sm table-bordered table-hover">
                            <thead>
                                <tr>
                                    <th style="width:50px;">#</th>
                                    <th style="width:auto;">金额</th>
                                    <th style="width:200px;">时间</th>
                                    <th style="width:80px;">状态</th>
                                </tr>
                            </thead>
                            <tbody>
                                {volist name="logList" id="vo"}
                                <tr>
                                    <td>{$vo.id}</td>
                                    <td>{$vo.amount}</td>
                                    <td>{$vo.create_time|date='Y/m/d H:i:s',###}</td>
                                    <td>
                                        {if condition="$vo.status == 1"}
                                        <button class="layui-btn layui-btn-primary layui-btn-xs">等待支付</button>
                                        {elseif condition="$vo.status == 2"/}
                                        <button class="layui-btn layui-btn-normal layui-btn-xs">支付完成</button>
                                        {elseif condition="$vo.status == 3"/}
                                        <button class="layui-btn layui-btn-warm layui-btn-xs">等待确认</button>
                                        {elseif condition="$vo.status == 0"/}
                                        <button class="layui-btn layui-btn-danger layui-btn-xs">支付退票</button>
                                        {else /}
                                        <button class="layui-btn layui-btn-danger layui-btn-xs">未知错误</button>
                                        {/if}
                                    </td>
                                </tr>
                                {/volist}
                            </tbody>
                        </table>
                    </div>
                    {$logList->render()}
                    {empty name="logList"}
                    <div class="card" id="context-menu-multi">
                        <div class="card-body">
                            <p class="card-text text-center text-danger">
                                <i class="icon-compass"></i>
                                暂无数据...
                            </p>
                        </div>
                    </div>
                    {/empty}
                </div>
            </div>
        </div>
    </div>
</div>
{/block}

{block name="pagejs"}

<script src="__STATIC__/cloudui/js/formpickers.js"></script>
<script>
    layui.use(['form'], function(){
        let $ = layui.$
            ,form = layui.form; // 验证码限制时间

        function initPageHash(hash){
            $(".pagination a").each(function(){
                var link = $(this);
                link.attr("href",link.attr("href") + hash);
            });
        }
       
        if(location.hash) {
            var link =  $('#logTabs a[href="' + location.hash + '"]');
            if(link.length>0){
                initPageHash(location.hash);
                link.tab('show');
            }
        }

        $('#logTabs a').on('click', function (e) {
            initPageHash(this.getAttribute("href"));
            $(this).tab('show');
        });

        //监听提现计算
        $('#amount').bind('input propertychange', function() {
            let amount = $('#amount').val();

            $('#fee').val(amount*(2/1000));
        });

        //数据验证
        form.verify({
            vernum: function(v) {
                // if (v * 100 > $("#enable").val()* 100) return "提现金额大于可用金额！";
                // if ( 100 > v * 10) return "满10元才可提现哟！";
            }
        });

        //监听提现提交
        form.on('submit(app-balance-apply-submit)', function(data){
            document.getElementById("app-balance-charge-form").submit();

            // let field = data.field;
            // console.log(field);
            // //提交
            // $.ajax({
            //     url:'{:url(\'index/Balance/charge\')}',
            //     method:"POST",
            //     data:field, success:function (res) {
            //         if (res.code == 1){setTimeout("location.reload();",1500);}
            //         showToast(res);
            //     }
            // });
        });

        //监听设置提交
        form.on('submit(app-balance-apply-set)', function(data){
            let field = data.field;
            console.log(field);
            let obj = new Object();
                obj.code = 2;
                obj.msg = '等待开发...';
            showToast(obj);
        });
    });
</script>
{/block}
